<template>
  <el-dialog :title="!dataForm.id ? $t('Common.Add') : $t('Common.Edit')" :close-on-click-modal="false" :visible.sync="visible" v-if="visible">
    <el-form v-loading="dataListLoading" element-loading-text="正在加载中" :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()" label-width="80px">
      <el-form-item label="房间楼层" prop="floorId">
        <el-select v-model="dataForm.floorId" filterable placeholder="请选择楼层">
          <el-option-group v-for="group in floorDataList" :key="group.id" :label="group.label">
            <el-option v-for="item in group.children" :key="item.id" :label="item.label" :value="item.id">
            </el-option>
          </el-option-group>
        </el-select>
      </el-form-item>
      <el-form-item label="房间房型" prop="roomId">
        <el-select v-model="dataForm.roomId" filterable placeholder="请选择房型">
          <el-option v-for="item in roomList" :key="item.id" :label="item.name" :value="item.id">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item v-if="type == 2" label="房间前缀" prop="roomSign">
        <el-row>
          <el-col :span="6">
            <el-input v-model="dataForm.roomSign" placeholder="房间前缀"></el-input>
          </el-col>
          <el-col :span="12" style="margin-left: 10px;">
            <span>如果房号为A101,那么在此填A</span>
          </el-col>
        </el-row>
      </el-form-item>
      <el-form-item v-if="type == 1" label="房间前缀" >
        <el-input v-model="dataForm.roomSign" placeholder="前缀"></el-input>
      </el-form-item>
      <el-form-item v-if="type == 1" label="房间房号" prop="roomNum">
        <el-input v-model="dataForm.roomNum" placeholder="房号"></el-input>
      </el-form-item>

      <el-form-item v-if="type == 2" label="房号从">
        <el-input-number v-model="dataForm.min" :min="0" :step="1" step-strictly></el-input-number>
        至
        <el-input-number v-model="dataForm.max" :min="0" :step="1" step-strictly></el-input-number>
      </el-form-item>
      <el-form-item v-if="type == 2" label="尾号过滤">
        <el-row>
          <el-col :span="12">
            <el-input v-model="dataForm.numFils" placeholder="例: 4,7"></el-input>
          </el-col>
          <el-col :span="12">

          </el-col>
        </el-row>
      </el-form-item>
      <el-form-item label="房间描述">
        <el-input v-model="dataForm.roomDesc" placeholder="特征描述" maxlength="200" type="textarea" :rows="2"></el-input>
      </el-form-item>
    </el-form>
    <span slot="footer" class="dialog-footer">
      <el-button @click="visible = false">{{ $t('Common.Cancel') }}</el-button>
      <el-button type="primary" v-if="type == 1" @click="dataFormSubmit()">确定</el-button>
      <el-button type="primary" v-if="type == 2" :loading="btnLoading2" @click="dataFormSubmit2()">确定</el-button>
    </span>
  </el-dialog>
</template>

<script>
  export default {
    data() {
      return {
        //1 正常添加   2批量添加
        type: '',
        roomList: [],
        floorDataList: [],
        visible: false,
        dataListLoading: false,
        dataForm: {
          id: 0,
          floorId: '',
          sellerId: '',
          roomId: '',
          roomSign: '',
          roomNum: '',
          roomDesc: '',
          createTime: '',
          min: 1,
          max: 2,
          numFils: ''
        },
        dataRule: {
          floorId: [{
            required: true,
            message: '楼层不能为空',
            trigger: 'blur'
          }],
          roomId: [{
            required: true,
            message: '房型不能为空',
            trigger: 'blur'
          }],
          roomNum: [{
            required: true,
            message: '房号不能为空',
            trigger: 'blur'
          }]
        },

        btnLoading2: false
      }
    },
    // watch: {
    //   'dataForm.min'(newVal) {
    //     if (newVal > this.dataForm.max) {
    //       this.dataForm.max = newVal
    //     }
    //   }
    // },
    methods: {
      init(id, type) {
        Object.assign(this.$data,this.$options.data())
        this.type = type
        this.dataForm.id = id || 0
        this.visible = true
        this.getFloorList();
        this.getRoom();
        this.$nextTick(() => {
          if (this.dataForm.id) {
            this.$http({
              url: this.$http.adornUrl(`/hotel/thotelfloorroom/info/${this.dataForm.id}`),
              method: 'get',
              params: this.$http.adornParams()
            }).then(({
              data
            }) => {
              if (data && data.code === 0) {
                this.dataForm.floorId = data.tHotelFloorRoom.floorId
                this.dataForm.sellerId = data.tHotelFloorRoom.sellerId
                this.dataForm.roomId = data.tHotelFloorRoom.roomId
                this.dataForm.roomSign = data.tHotelFloorRoom.roomSign
                this.dataForm.roomNum = data.tHotelFloorRoom.roomNum
                this.dataForm.roomDesc = data.tHotelFloorRoom.roomDesc
                this.dataForm.createTime = data.tHotelFloorRoom.createTime
              }
            })
          }
        })
      },
      // 表单提交
      dataFormSubmit() {
         var roomlist=this.roomList.filter(item => item.id=this.dataForm.roomId);

        this.$refs['dataForm'].validate((valid) => {
          if (valid) {
            this.dataListLoading = true;
            this.$http({
              url: this.$http.adornUrl(`/hotel/thotelfloorroom/${!this.dataForm.id ? 'save' : 'update'}`),
              method: 'post',
              data: this.$http.adornData({
                'id': this.dataForm.id || undefined,
                'floorId': this.dataForm.floorId,
                'sellerId': this.dataForm.sellerId,
                'roomId': this.dataForm.roomId,
                'roomSign': this.dataForm.roomSign,
                'roomNum': this.dataForm.roomNum,
                'roomDesc': this.dataForm.roomDesc,
                'createTime': this.dataForm.createTime,
                'roomName': roomlist[0].name
              })
            }).then(({
              data
            }) => {
              this.dataListLoading = false;
              if (data && data.code === 0) {
                this.$message({
                  message: this.$t('Common.OperationSuccessful'),
                  type: 'success',
                  duration: 1500,
                  onClose: () => {
                    this.visible = false
                    this.$emit('refreshDataList')
                  }
                })
              } else {
                this.$message.error(data.msg)
              }
            })
          }
        })
      },
      // 表单提交
      dataFormSubmit2() {
         var roomlist=this.roomList.filter(item => item.id=this.dataForm.roomId);
        
        this.$refs['dataForm'].validate((valid) => {
          if (valid) {
            this.dataListLoading = true;
            this.btnLoading2 = true
            this.$http({
              url: this.$http.adornUrl(`/hotel/thotelfloorroom/save2`),
              method: 'post',
              data: this.$http.adornData({
                'floorId': this.dataForm.floorId,
                'sellerId': this.dataForm.sellerId,
                'roomId': this.dataForm.roomId,
                'roomSign': this.dataForm.roomSign,
                'min': this.dataForm.min,
                'roomDesc': this.dataForm.roomDesc,
                'max': this.dataForm.max,
                'numFils': this.dataForm.numFils,
                'roomName': roomlist[0].name
              })
            }).then(({
              data
            }) => {
              this.dataListLoading = false

              if (data && data.code === 0) {
                this.$message({
                  message: this.$t('Common.OperationSuccessful'),
                  type: 'success',
                  duration: 1500,
                  onClose: () => {
                    this.visible = false
                    this.$emit('refreshDataList')

                    this.btnLoading2 = false
                  }
                })
              } else {
                this.$message.error(data.msg)

                this.dataListLoading = false
                this.btnLoading2 = false
              }
            })
          }
        })
      },
      //获取楼层楼栋数据
      getFloorList() {
        this.$http({
          url: this.$http.adornUrl('/hotel/thotelfloor/data'),
          method: 'get',
          params: this.$http.adornParams({})
        }).then(({
          data
        }) => {
          if (data && data.code === 0) {
            this.floorDataList = data.data;
          } else {
            this.floorDataList = [];
          }
        });
      },
      //获取所有房型
      getRoom() {
        this.$http({
          url: this.$http.adornUrl("/hotel/hotelroom/list"),
          method: "get",
          params: this.$http.adornParams({
            page: 1,
            limit: 99,
            name: "",
            classify: 1,
            sysState: 1,
            state: ''
          })
        }).then(({
          data
        }) => {
          console.log(data)
          if (data && data.code === 0) {
            this.roomList = data.page.list;
          } else {
            this.roomList = [];
          }
        });
      },
    }
  }
</script>
